<template>
<div>
    <div class="text-center padding-bottom-sm" style="background-color: white">
        <div>
            <div class="text-lg padding-top-lg" style="color: #737373;"><text>近七日销售</text></div>
            <div class="flex align-end padding-sm">
                <div class="text-bold text-sl text-price flex-sub text-right" style="color: #4cd964"><text>{{businessAnalysisReport.salesVolume}}</text></div>
                <div class="flex-sub text-sm text-left padding-bottom-xs">
                    <text class="padding-left-sm" style="color: #666666">较前四周均值</text>
                    <text v-if="businessAnalysisReport.compareWithSalesVolume>0" class="cuIcon-fold sm text-green"></text>
                    <text v-else-if="businessAnalysisReport.compareWithSalesVolume<0" class="cuIcon-unfold sm text-red"></text>
                    <text v-else class="cuIcon-title sm text-orange"></text>
                  <text style="color: #666666">{{businessAnalysisReport.compareWithSalesVolume}}</text>
                </div>
            </div>
        </div>

        <div class="text-center flex text-df margin padding-sm" style="color: #727272">
          <div class="flex-sub">
            <div>销售笔数</div>
            <div class="text-lg text-black margin-top-xs" style="color: #666666;">
              {{businessAnalysisReport.transactionsNum}}
              <text v-if="businessAnalysisReport.compareWithTransactionsNum>0" class="cuIcon-fold xs text-green"></text>
              <text v-else-if="businessAnalysisReport.compareWithTransactionsNum<0" class="cuIcon-unfold xs text-red"></text>
              <text v-else class="cuIcon-title xs text-orange"></text>
              <text class="text-xs" style="color: #666666">{{businessAnalysisReport.compareWithTransactionsNum}}</text>
            </div>
          </div>
          <div class="flex-sub">
            <div>动销率</div>
            <div class="text-lg text-black margin-top-xs" style="color: #666666;">{{businessAnalysisReport.turnoverRate * 100}}%</div>
          </div>
          <div class="flex-sub">
            <div>新顾客</div>
            <div class="text-lg text-black margin-top-xs" style="color: #666666;">{{customerNewAndOld.newNum}}</div>
          </div>
        </div>
    </div>


    <div class="margin-top-sm bg-white text-center">
      <div class="solid-bottom padding-bottom padding-top padding-left-sm" @click="reportByDay">交易日报</div>
      <div class="solid-bottom padding-bottom padding-top padding-left-sm" @click="reportByMonth">交易月报</div>
    </div>
</div>
</template>

<script>
import request from "../../utils/request";
import dateTimeUtils from "../../utils/dateTimeUtils";

export default {
  name: "index",
    data(){
      return{
          businessAnalysisReport:{},
          customerNewAndOld:{}
      }
    },
    onLoad:function (option) {
        uni.setNavigationBarTitle({
            title: '经营分析'
        });
        let endDate = new Date();
        let startDate = dateTimeUtils.dateTimePlusMinus(endDate, -7)
        endDate = dateTimeUtils.dateTimeFormat(endDate)
        startDate = dateTimeUtils.dateTimeFormat(startDate)
      request.post("/business/get/businessAnalysisReport",{
          startDate: startDate,
          endDate: endDate,
          storeId: uni.getStorageSync("currentStoreMain").storeId
      }).then(res=>{
          this.businessAnalysisReport=res.data
          console.log(this.businessAnalysisReport)
      })
        request.post("/customer/get/customerNewAndOld",{
            startDate: startDate,
            endDate: endDate,
            storeId: uni.getStorageSync("currentStoreMain").storeId
        }).then(res=>{
            this.customerNewAndOld=res.data
            console.log(this.customerNewAndOld)
        })
    },
  
  methods:{
    reportByDay:function () {
      uni.navigateTo({
        url:"/pages/business/Report?by=day"
      })
    },
    reportByMonth:function () {
      uni.navigateTo({
        url:"/pages/business/Report?by=month"
      })
    }
  }
}
</script>

<style scoped>

</style>